import bb.cascades 1.0
import "chartdata.js" as Chelp

NavigationPane {
    id: chartNavigation
    peekEnabled: false
    
    Page {
        id: chart
        
        property string chart_type_mode
        
        actions: [
            // define the actions for first tab here
//            ActionItem {
//                title: qsTr("Rotate")
//                onTriggered: {
//                    //                imgTab1.rotationZ = imgTab1.rotationZ + 90;
//                }
//            },
//            ActionItem {
//                title: qsTr("Break")
//                onTriggered: {
//                    //                imgTab1.imageSource = "asset:///images/picture1br.png";
//                }
//            }
        ]
        
        titleBar: TitleBar {
            id: titleBar
            visibility: ChromeVisibility.Visible
            title: lang.chart_title
        }
        
        Container {
            //            Container {
            //                Label {
            //                    text: "aaaaaaaaaaaaaaaaaaaaaaa"
            //                }
            //            }
            
            Divider {
            }
            
            // chart type drop down
            Container {
                layout: StackLayout {
                    orientation: LayoutOrientation.LeftToRight
                }
                topPadding: 50
                
                Label {
                    layoutProperties: StackLayoutProperties {
                        spaceQuota: 1
                    }
                    verticalAlignment: VerticalAlignment.Center
                    text: lang.chart_chart_type
                }
                
                DropDown {
                    layoutProperties: StackLayoutProperties {
                        spaceQuota: 3
                    }
                    id: chart_type
                    maxWidth: 600
                    
                    //                    selectedOption: option0
                    onSelectedValueChanged:{
                        if (selectedValue == "0"){
                            chart.chart_type_mode = selectedValue ;
                            ctn_income.show();
                            //                            console.log(00000);
                            ctn_expenses.hide() ;
                            //                            console.log(11111);
                            ctn_starttime.show() ;
                            //                            console.log(22222);
                            ctn_starttime.set_text(lang.chart_time_start);
                            ctn_endtime.show() ;
                            dtp_end.value = Chelp.get_date_after(dtp_start.value);
                        }else if (selectedValue == "1"){
                            chart.chart_type_mode = selectedValue ;
                            ctn_income.hide();
                            //                            console.log(00000);
                            ctn_expenses.show() ;
                            //                            console.log(11111);
                            ctn_starttime.show() ;
                            //                            console.log(22222);
                            ctn_starttime.set_text(lang.chart_time_start);
                            ctn_endtime.show() ;
                            dtp_end.value = Chelp.get_date_after(dtp_start.value);
                        }else if (selectedValue == "2"){
                            chart.chart_type_mode = selectedValue ;
                            ctn_income.hide();
                            //                            console.log(00000);
                            ctn_expenses.show() ;
                            //                            console.log(11111);
                            ctn_starttime.show() ;
                            //                            console.log(22222);
                            ctn_starttime.set_text(lang.chart_time);
                            ctn_endtime.hide() ;
                            dtp_end.value = Chelp.get_date_after(dtp_start.value);
                        }else if (selectedValue == "3"){
                            chart.chart_type_mode = selectedValue ;
                            ctn_income.hide();
                            //                            console.log(00000);
                            ctn_expenses.hide() ;
                            //                            console.log(11111);
                            ctn_starttime.show() ;
                            //                            console.log(22222);
                            ctn_starttime.set_text(lang.chart_time_start);
                            ctn_endtime.show() ;
//                            dtp_end.value = Chelp.get_date_after(dtp_start.value);
                        }else if (selectedValue == "4"){
                            chart.chart_type_mode = selectedValue ;
                            ctn_income.hide();
                            //                            console.log(00000);
                            ctn_expenses.hide() ;
                            //                            console.log(11111);
                            ctn_starttime.show() ;
                            //                            console.log(22222);
                            ctn_starttime.set_text(lang.chart_time_start);
                            ctn_endtime.show() ;
//                            dtp_end.value = Chelp.get_date_after(dtp_start.value);
                        }
                    
                    }
                    
                    Option {
                        id: option0
                        text : lang.chart_chart_Annualincome
                        //                        description : "Sets the alarm to 1 minutes"
                        //                        value : "chart_chart_Annualincome"
                        value : "0"
                    }
                    
                    Option {
                        text : lang.chart_chart_Annualexpenditure
                        //                        description : "Sets the alarm to 2 minutes"
                        //                        value : "chart_chart_Annualexpenditure"
                        value : "1"
                    }
                    Option {
                        text : lang.chart_chart_Monthlyexpenditure
                        //                        description : "Sets the alarm to 3 minutes"
                        //                        value : "chart_chart_Monthlyexpenditure"
                        value : "2"
                    }
                    Option {
                        text : lang.chart_chart_proportionincome
                        //                        description : "Sets the alarm to 3 minutes"
                        //                        value : "chart_chart_proportionincome"
                        value : "3"
                    }
                    Option {
                        text : lang.chart_chart_proportionexpenses
                        //                        description : "Sets the alarm to 3 minutes"
                        //                        value : "chart_chart_proportionexpenses"
                        value : "4"
                    }
                }
            }
            
            // type of income           
            Container {
                id: ctn_income
                layout: StackLayout {
                    orientation: LayoutOrientation.LeftToRight
                }
                topPadding: 50
                maxHeight: 0
                
                function show()
                {
                                    if (maxHeight == 0)
                maxHeight = 99999 ;
                }
                
                function hide()
                {
                                    if (maxHeight > 0)
                maxHeight = 0 ;
                }
                
                Label {
                    layoutProperties: StackLayoutProperties {
                        spaceQuota: 1
                    }
                    multiline: true
                    verticalAlignment: VerticalAlignment.Center
                    text: lang.chart_income_type //chart_income_type or chart_expenses_type
                }
                
                DropDown {
                    id: dd_imcome_type
                    layoutProperties: StackLayoutProperties {
                        spaceQuota: 3
                    }
                    maxWidth: 600
                    
                    selectedOption: option_income_all
                    Option {
                        id: option_income_all
                        text : lang.type_all
                        //                        description : "Sets the alarm to 2 minutes"
                        value : ""
                    
                    }
                    Option {
                        id: option2
                        text : lang.income_salary
                        //                        description : "Sets the alarm to 1 minutes"
                        value : "fitypeid=1"
                    
                    }
                    
                    Option {
                        text : lang.income_investment
                        //                        description : "Sets the alarm to 2 minutes"
                        value : "fitypeid=2"
                    
                    }
                    Option {
                        text : lang.income_others
                        //                        description : "Sets the alarm to 3 minutes"
                        value : "fitypeid=3"
                    
                    }
                }
            }
            
            // type of expenses            
            Container {
                id: ctn_expenses
                layout: StackLayout {
                    orientation: LayoutOrientation.LeftToRight
                }
                topPadding: 50
                maxHeight: 0
                
                function show(){
                    if (maxHeight == 0)
maxHeight = 99999 ;
                }
                
                function hide(){
                    if (maxHeight > 0)
maxHeight = 0 ;
                }
                
                Label {
                    layoutProperties: StackLayoutProperties {
                        spaceQuota: 1
                    }
                    multiline: true
                    verticalAlignment: VerticalAlignment.Center
                    text: lang.chart_expenses_type //chart_income_type or chart_expenses_type
                }
                
                DropDown {
                    id: dd_expenses_type
                    layoutProperties: StackLayoutProperties {
                        spaceQuota: 3
                    }
                    maxWidth: 600
                    
                    selectedOption: option_expense_all
                    Option {
                        id: option_expense_all
                        text : lang.type_all
                        //                        description : "Sets the alarm to 2 minutes"
                        value : ""
                    
                    }
                    Option {
                        id: option4
                        text : lang.expenses_food
                        //                        description : "Sets the alarm to 1 minutes"
                        value : "fptypeid=1"
                    
                    }
                    
                    Option {
                        text : lang.expenses_living
                        //                        description : "Sets the alarm to 2 minutes"
                        value : "fptypeid=2"
                    
                    }
                    Option {
                        text : lang.expenses_entertainment
                        //                        description : "Sets the alarm to 3 minutes"
                        value : "fptypeid=3"
                    
                    }
                    Option {
                        id: option7
                        text : lang.expenses_investment
                        //                        description : "Sets the alarm to 1 minutes"
                        value : "fptypeid=4"
                    
                    }
                    
                    Option {
                        text : lang.expenses_travel
                        //                        description : "Sets the alarm to 2 minutes"
                        value : "fptypeid=5"
                    
                    }
                    Option {
                        text : lang.expenses_others
                        //                        description : "Sets the alarm to 3 minutes"
                        value : "fptypeid=6"
                    
                    }
                }
            }
            
            // start time
            Container {
                id: ctn_starttime
                layout: StackLayout {
                    orientation: LayoutOrientation.LeftToRight
                }
                topPadding: 50
                maxHeight: 0
                
                function show(){
                    if (maxHeight == 0)
maxHeight = 99999 ;
                }
                
                function hide(){
                    if (maxHeight > 0)
maxHeight = 0 ;
                }
                
                function set_text(ttext){
                    label_starttime.text = ttext ;
                }
                
                Label {
                    layoutProperties: StackLayoutProperties {
                        spaceQuota: 1
                    }
                    id: label_starttime
                    verticalAlignment: VerticalAlignment.Center
                    text: lang.chart_time_start
                }
                
                DateTimePicker {
                    id: dtp_start
                    layoutProperties: StackLayoutProperties {
                        spaceQuota: 3
                    }
                    maxWidth: 600
                    
                    onExpandedChanged:{
                        if (chart.chart_type_mode == "0" || chart.chart_type_mode == "1" || chart.chart_type_mode == "2")
                        dtp_end.value = Chelp.get_date_after(dtp_start.value);
                    }
                }
            }
            
            // end time
            Container {
                id: ctn_endtime
                layout: StackLayout {
                    orientation: LayoutOrientation.LeftToRight
                }
                topPadding: 50
                maxHeight: 0
                
                function show(){
                    if (maxHeight == 0)
maxHeight = 99999 ;
                }
                
                function hide(){
                    if (maxHeight > 0)
maxHeight = 0 ;
                }
                
                Label {
                    layoutProperties: StackLayoutProperties {
                        spaceQuota: 1
                    }
                    verticalAlignment: VerticalAlignment.Center
                    text: lang.chart_time_end
                }
                
                DateTimePicker {
                    id: dtp_end
                    layoutProperties: StackLayoutProperties {
                        spaceQuota: 3
                    }
                    maxWidth: 600
                    
                    onExpandedChanged:{
                        if (chart.chart_type_mode == "0" || chart.chart_type_mode == "1" || chart.chart_type_mode == "2")
                        dtp_start.value = Chelp.get_date_before(dtp_end.value);
                    }
                }
            }
            
            Container {
                topPadding: 50
                horizontalAlignment: HorizontalAlignment.Center
                
                Button {
                    text: lang.chart_generate
                    
                    onClicked: {
                        var chartdetailpage = chartNavigation.getChartDetailPage();
                        var rt;
                        if (chart.chart_type_mode == "0"){
                            rt = database.GetIncomeRpt(dtp_start.value, dtp_end.value, 0, dd_imcome_type.selectedValue);
                            if (rt.length == 0){
                                root.showmsg(lang.error_no_data);
                            }else{
                                var year_income = Chelp.year_income(rt, dtp_start.value, dtp_end.value) ;
                                chartdetailpage.set_data("0", year_income);
                                chartdetailpage.add_line_year(dtp_start.value, dtp_end.value, Chelp.findMaxYear(rt), Chelp.findMinYear(rt)) ;
                                chartNavigation.push(chartdetailpage);
                            }
                            //                            console.log("year_income : " + JSON.stringify(year_income));
                        }else if (chart.chart_type_mode == "1"){
                            rt = database.GetPaymentRpt(dtp_start.value, dtp_end.value, 0, dd_expenses_type.selectedValue);
                            if (rt.length == 0){
                                root.showmsg(lang.error_no_data);
                            }else{
                                var year_expenses = Chelp.year_expenses(rt, dtp_start.value, dtp_end.value) ;
                                chartdetailpage.set_data("1", year_expenses);
                                chartdetailpage.add_line_year(dtp_start.value, dtp_end.value, Chelp.findMaxYear(rt), Chelp.findMinYear(rt)) ;
                                chartNavigation.push(chartdetailpage);
                            }
                        }else if (chart.chart_type_mode == "2"){
                            rt = database.GetdayPaymentRpt(dtp_start.value, 0, dd_expenses_type.selectedValue);
                            if (rt.length == 0){
                                root.showmsg(lang.error_no_data);
                            }else{
                                var month_expenses = Chelp.month_expenses(rt) ;
                                //                            console.log("month_expenses : " + JSON.stringify(month_expenses));
                                chartdetailpage.set_data("2", month_expenses);
                                chartdetailpage.add_line_month(dtp_start.value, Chelp.findMaxMonth(rt), Chelp.findMinMonth(rt)) ;
                                chartNavigation.push(chartdetailpage);
                            }
                        }else if (chart.chart_type_mode == "3"){
                            rt = database.GetIncomeRptGroupByType(dtp_start.value, dtp_end.value, 0);
                            if (rt.length == 0){
                                root.showmsg(lang.error_no_data);
                            }else{
                                chartdetailpage.set_data("3", rt);
                                chartdetailpage.add_pie_income(dtp_start.value, dtp_end.value, rt) ;
                                chartNavigation.push(chartdetailpage);
                            }
                        }else if (chart.chart_type_mode == "4"){
                            rt = database.GetPaymentRptGroupByType(dtp_start.value, dtp_end.value, 0);
                            if (rt.length == 0){
                                root.showmsg(lang.error_no_data);
                            }else{
                                chartdetailpage.set_data("4", rt);
                                chartdetailpage.add_pie_expenses(dtp_start.value, dtp_end.value, rt) ;
                                chartNavigation.push(chartdetailpage);
                            }
                        }
                        // show detail page when the button is clicked
//                        console.log("database rt : " + JSON.stringify(rt));
//                        console.debug("pushing detail " + chartdetailpage)
//                        chartNavigation.push(chartdetailpage);
                    }
                }
            }
        }
    }
    
    onPopTransitionEnded: {
        chartDetailPage.destroy();
        home.updateStatus() ;
    }
    
    attachedObjects: [
        ComponentDefinition {
            id: chartDetailDefinition
            source: "ChartDetail.qml"
        }
    ]
    property Page chartDetailPage
    function getChartDetailPage() {
        //        if (! addDetailPage) {
        chartDetailPage = chartDetailDefinition.createObject();
        //        }
        return chartDetailPage;
    }
}